<template>
  <div>
    
<el-button type="primary" @click="willadd">添加</el-button>

    <v-form :info='info' :arr='arr' @init='init' ref="form"></v-form>
    <v-list :arr='arr' @info='infoBian' @deleteone="deleteone"></v-list>

  </div>
</template>

<script>
import vList from './components/list.vue'
import vForm from './components/form.vue'
import { reqmenulist,reqmenuinfo, reqmenudelete } from '../../http/api'

export default {
  components:{
    vList,
    vForm
  },
  data(){
    return {
      istree:true,
      info:{
            isshow:false,
            isAdd:true,//isAdd=true 添加   isAdd=false 编辑 
        },
        //列表数据存放
        arr:[],
    }
  },
  mounted(){
    this.init()
  },
  
 methods:{
   willadd(){
     this.info.isshow=true;
     this.info.isAdd=true;
    
   },
   //编辑
  infoBian(id){
    this.info.isshow=true;
    this.info.isAdd=false; 
    //通知form调用函数 发起请求
    this.$refs.form.getOne(id)  
    
  },
   init(){
    //请求列表数据
    reqmenulist({istree:true}).then(res=>{
      if(res.data.code==200){
        this.arr=res.data.list
      }
    })
  },
  //删除一条
  deleteone(id){
    reqmenudelete({id}).then(res=>{
      if(res.data.code==200){
      //刷新列表
      this.init();
      }

    })
  }
 }
}
</script>

<style lang='less' scoped >
@import '../../less/index.less';

 .el-button{
    margin: @padding10 !important; 
  }
</style>